<!doctype html>
[#escape x as (x)!?html]
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>${info.title} - ${site.fullNameOrName}${global.customs['poweredBy']}</title>
    <meta name="keywords" content="${node.keywords}">
    <meta name="description" content="${node.description}">
    [#include 'inc_meta.html'/]
    [#include 'inc_css.html'/]
    [#include 'inc_js.html'/]
</head>
<body>
[#include 'inc_header.html'/]
<div class="container">
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb col">
            [#list node.hierarchy as n]
            <li class="breadcrumb-item"><a href="${n.url}">${n.name}</a></li>
            [/#list]
        </ol>
    </nav>
</div>
<div class="container">
    <div class="row">
        <div class="col mt-2">
            <h3 class="cm-ff-yh">${info.title}</h3>
            <div class="mt-3 pb-1 border-bottom text-muted">
                <span>${info.publishDate?string('yyyy-MM-dd HH:mm')}</span>
                <span class="ml-2">${info.author!info.creator.realName!info.creator.username}</span>
                <i class="ml-2 far fa-eye"></i> <span id="info_views"></span>
                <script>$("#info_views").load("${ctx}/info_views/${info.id}?d=" + new Date() * 1);</script>
                <script src="${dy}/app?template=info_favorites&id=${info.id}"></script>
            </div>
            <div id="full-container" class="mt-3 mb-3 p-1 text-center bg-dark">
                <div id="toolbar" class="sticky-top mb-2">
                    <button class="btn btn-secondary" onclick="zoomIn()">-</button>
                    <button class="btn btn-secondary ml-2" onclick="zoomOut()">+</button>
                    <button id="fullscreenButton" class="btn btn-secondary ml-2" onclick="fullscreen()">全屏</button>
                    <button id="exitFullscreenButton" class="btn btn-secondary ml-2 hidden" onclick="exitFullscreen()">退出</button>
                </div>
                <div id="container" class="overflow-auto"></div>
            </div>
            <div class="lead d-flex justify-content-center text-info">
                <div class="cm-pointer" onclick="voteUp()"><i class="far fa-thumbs-up"></i> <span id="ups"></span></div>
                <div class="cm-pointer ml-4" onclick="voteDown()"><i class="far fa-thumbs-down"></i> <span id="downs"></span></div>
            </div>
            <script>
                function voteUp() {
                    $.post('${dy}/info_digg',{id:${info.id}},function(data){
                        if(data!=='0'){$('#ups').text(data);}else{alert("你已经顶过一次！")}
                    });
                }
                function voteDown() {
                    $.post('${dy}/info_bury',{id:${info.id}},function(data){
                        if(data!=='0'){$('#downs').text(data);}else{alert("你已经踩过一次！")}
                    });
                }
                $.get('${dy}/info_diggs/${info.id}?d='+new Date()*1,function(data) {
                    $('#ups').text(data[0]);$('#downs').text(data[1]);
                },"json");
            </script>
            <div class="bdsharebuttonbox mt-2"><a href="#" class="bds_more a-none" data-cmd="more">分享到：</a><a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a><a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a><a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a><!--<a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>--><a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a></div>
            <script>
                window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"share":{}};
                with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];
            </script>
            <ul class="mt-3 list-unstyled">
                [@InfoPrev id=info.id;bean]
                [#if bean??]
                <li class="text-truncate"><strong>上一条：</strong><a href="${bean.url}" class="text-reset">${bean.title}</a></li>
                [#else]
                <li class="text-truncate"><strong>上一条：</strong>没有了</li>
                [/#if]
                [/@InfoPrev]
                [@InfoNext id=info.id;bean]
                [#if bean??]
                <li class="text-truncate"><strong>下一条：</strong><a href="${bean.url}" class="text-reset">${bean.title}</a></li>
                [#else]
                <li class="text-truncate"><strong>下一条：</strong>没有了</li>
                [/#if]
                [/@InfoNext ]
            </ul>
            <h6 class="border-bottom mt-2"><span class="border-primary cm-block-head-bottom">相关新闻</span></h6>
            [@InfoFulltextList q=info.title excludeId=info.id limit=5;list]
            <ul class="list-unstyled cm-list-round">
                [#list list as fulltextInfo]
                <li class="text-truncate">[@A bean=fulltextInfo class="a text-reset"/]</li>
                [/#list]
            </ul>
            [/@InfoFulltextList]
        </div>
    </div>
</div>
<script src="_files/vendor/pdfjs-dist/build/pdf.js"></script>
<script>
    var url = '${info.docPdf}';
    // Loaded via <script> tag, create shortcut to access PDF.js exports.
    var pdfjsLib = window['pdfjs-dist/build/pdf'];
    // The workerSrc property shall be specified.
    pdfjsLib.GlobalWorkerOptions.workerSrc = '_files/vendor/pdfjs-dist/build/pdf.worker.js';

    var pdfDoc;
    var canvas = new Array(), context = new Array();
    var fullContainer = document.getElementById('full-container');
    var container = document.getElementById('container');
    var containerWidth = $(container).width();
    var scale;
    var numPages;
    var pageRendering = 0;
    var scalePending = null;

    function renderPDF(pageNumber) {
        pdfDoc.getPage(pageNumber).then(function (page) {
            console.log('Page loaded');
            var viewport;
            if (!scale) {
                viewport = page.getViewport({scale: 1});
                scale = containerWidth / viewport.width;
            }
            viewport = page.getViewport({scale: scale});
            canvas[pageNumber - 1].height = viewport.height;
            canvas[pageNumber - 1].width = viewport.width;

            // Render PDF page into canvas context
            var renderContext = {
                canvasContext: context[pageNumber - 1],
                viewport: viewport
            };
            var renderTask = page.render(renderContext);
            renderTask.promise.then(function () {
                console.log('Page rendered');
                pageRendering--;
                if (scalePending && pageRendering === 0) {
                    scale = scalePending;
                    scalePending = null;
                    renderPDFs();
                }
            });
        });
    }

    function renderPDFs() {
        pageRendering = numPages;
        for (var i = 1; i <= numPages; i++) {
            renderPDF(i);
        }
    }

    function zoomIn() {
        if (scale <= 0.3 || (scalePending && scalePending <= 0.3)) return;
        if (pageRendering > 0) {
            if (scalePending) {
                scalePending = scalePending - 0.2
            } else {
                scalePending = scale - 0.2;
            }
        } else{
            scale -= 0.2;
            renderPDFs();
        }
    }

    function zoomOut() {
        if (pageRendering > 0) {
            if (scalePending) {
                scalePending = scalePending + 0.2
            } else {
                scalePending = scale + 0.2;
            }
        } else{
            scale += 0.2;
            renderPDFs();
        }
    }

    // 进入全屏
    function fullscreen() {
        if (fullContainer.requestFullscreen) {
            fullContainer.requestFullscreen();
        } else if (fullContainer.mozRequestFullScreen) {
            fullContainer.mozRequestFullScreen();
        } else if (fullContainer.webkitRequestFullscreen) {
            fullContainer.webkitRequestFullscreen();
        } else if (fullContainer.msRequestFullscreen) {
            fullContainer.msRequestFullscreen();
        }
    }
    // 退出全屏
    function exitFullscreen() {
        if (document.exitFullscreen) {
            document.exitFullscreen();
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if (document.webkitExitFullscreen) {
            document.webkitExitFullscreen();
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        }
    }

    function isFullscreen() {
        return !!(document.fullscreenElement || document.mozFullScreen || document.webkitIsFullScreen || document.msFullscreenElement);
    }

    function _fullscreenChange() {
        if (isFullscreen()) {
            $('#fullscreenButton').hide();
            $('#exitFullscreenButton').show();
            $(fullContainer).addClass('overflow-auto');
        } else {
            $('#fullscreenButton').show();
            $('#exitFullscreenButton').hide();
            $(fullContainer).removeClass('overflow-auto');
        }
    }

    function _addFullscreenChangeListeners() {
        window.addEventListener("fullscreenchange", _fullscreenChange);
        window.addEventListener("mozfullscreenchange", _fullscreenChange);
        window.addEventListener("webkitfullscreenchange", _fullscreenChange);
        window.addEventListener("MSFullscreenChange", _fullscreenChange);
    }

    _addFullscreenChangeListeners();

    // Asynchronous download of PDF
    pdfjsLib.getDocument(url).promise.then(function (pdfDoc_) {
        pdfDoc = pdfDoc_;
        console.log('PDF loaded');
        numPages = pdfDoc.numPages;
        for (var i = 1; i <= numPages; i++) {
            var pageDiv = document.createElement('div');
            pageDiv.setAttribute('id', 'pdf-page-' + i);
            container.appendChild(pageDiv);
            canvas[i - 1] = document.createElement('canvas');
            pageDiv.appendChild(canvas[i - 1]);
            context[i - 1] = canvas[i - 1].getContext('2d');
        }
        renderPDFs();
    }, function (reason) {
        // PDF loading error
        console.error(reason);
    });

</script>
[#include 'inc_footer.html'/]
</body>
</html>
[/#escape]
